<template>
  <div>
    <div class="essay_item" @click="goDetail(essayArr)">
        <div class="essay_pic">
            <img :src="essayArr.picurl" alt="">
        </div>
        <div class="essay_con">
            <h3>{{essayArr.title}}</h3>
            <div class="bottom">
                <div class="time">{{dateConversion(essayArr.posttime)}}</div>
                <div class="check_Number">{{getNum(essayArr.hits)}}</div>
            </div>
        </div>
    </div>
  </div>
</template>

<script>
// 数字转换-访问量转换
import digitalConversion  from '@/util/numConversion'
// 日期转换
import {myDate}  from '@/util/dateConversion'
export default {
    name:'essayItem',
    props:{
        essayArr:{
           type:Object
        }
    },
    methods:{
        // 调用转换访问量的函数
        getNum(num){
            return digitalConversion.getNum(num)
        },
        // 将时间戳转换为日期
        dateConversion(date){
            return myDate(date)
        },
        // 跳转到详情页
        goDetail(e){
            console.log(e);
            this.$router.push({
                path:'/detail',
                query:{
                    cid:e.classid,
                    id:e.id,
                    type:'list'
                }
            })
        }
    }
}
</script>

<style lang="less" scoped>
.essay_item{
    display: flex;
    border:1px solid #eee;
    margin-bottom: 0.3rem;
    .essay_pic{
        width: 50%;
        height: 1.5rem;
        padding: 0.5px;
        img{
            width: 100%;
            height: 100%;
        }
    }
    .essay_con{
        width: 100%;
        padding: 0.15rem;
        font-size: .2rem;
        display: flex;
        flex-direction: column;
        justify-content: space-between;
        h3{
            font-size: .28rem;
            font-weight: 400;
        }
        .bottom{
            display: flex;
            justify-content: space-between;
            font-size: .25rem;
            color: #888;
            margin-right: .3rem;
        }
    }
    }
</style>